// 定义less变量和css变量

// less变量
@primary: #409eff;
@success: #67c23a;
@warning: #e6a23c;
@danger: #f56c6c;
@info: #909399;
@mainColor: primary, success, warning, danger, info;

.eachColor(@i, @name, @color) when (@i < 7) {
    --chen-@{name}-@{i}: lighten(@color, @i * 5%);
    .eachColor(@i+1, @name, @color)
}


// 主题色彩
:root {
    --chen-primary: @primary;
    --chen-success: @success;
    --chen-warning: @warning;
    --chen-danger: @danger;
    --chen-info: @info;
    .eachColor(2, primary, @primary);
    .eachColor(2, success, @success);
    .eachColor(2, warning, @warning);
    .eachColor(2, danger, @danger);
    .eachColor(2, info, @info);
    // 其他变量颜色-中性色
    --chen-color-white: #fff;
    --chen-color-black: #000;
    --chen-bg-color: #fff;
    --chen-bg-color-page: #f2f3f5;
    --chen-bg-color-overlay: #fff;
    --chen-text-color-primary: #303133;
    --chen-text-color-regular: #606266;
    --chen-text-color-secondary: #909399;
    --chen-text-color-placeholder: #a8abb2;
    --chen-text-color-disabled: #c0c4cc;
    --chen-border-color: #dcdfe6;
    --chen-border-color-light: #e4e7ed;
    --chen-border-color-lighter: #ebeef5;
    --chen-border-color-extra-light: #f2f6fc;
    --chen-border-color-dark: #d4d7de;
    --chen-border-color-darker: #cdd0d6;
    --chen-fill-color: #f0f2f5;
    --chen-fill-color-light: #fafafa;
    --chen-fill-color-lighter: #fafcff;
    --chen-fill-color-extra-light: #ebedf0;
    --chen-fill-color-dark: #ebedf0;
    --chen-fill-color-darker: #e6e8eb;
    --chen-fill-color-blank: #fff;

    // 和border相关变量
    --chen-border-width: 1px;
    --chen-border-style: solid;
    --chen-border-color-hover: var(var(--chen-text-color-disabled));
    --chen-border-radius-base: 4px;
    --chen-border-radius-small: 2px;
    --chen-border-radius-round: 20px;
    --chen-border-radius-circle: 50%;

    // 和font
    --chen-font-size-extra-large: 20px;
    --chen-font-size-large: 18px;
    --chen-font-size-medium: 16px;
    --chen-font-size-base: 14px;
    --chen-font-size-extra-small: 12px;
    --chen-font-family: '"PingFang SC", "Roboto Mono", "Microsoft YaHei", 微软雅黑, Arial, sans-serif';
    --chen-font-weight-normal: 200;
    --chen-font-weight-base: 500;
    --chen-font-weight-heavy: 700;

    // 和disabled相关css变量
    --chen-disabled-bg-color: var(--chen-fill-color-light);
    --chen-disabled-text-color: var(--chen-text-color-placeholder);
    --chen-disabled-border-color: var(--chen-border-color-light);

    // 和过渡相关
    --chen-trasition-duration: 0.3s;
    --chen-trasition-duration-fast: 0.2s
}